// 后台主界面
function createShopTable(wyId, stId) {
    var wyChart = echarts.init(document.getElementById(wyId));
    var stChart = echarts.init(document.getElementById(stId));

    // 物业变化图
    $.post('/table/shops', {type: 1}, function (data) {
        var stages = data.data.stages;
        var shopInfo = data.data.shopInfos;
        var stageArr = [], shops = [], series = [];

        for (var i = stages.length - 1; i >= 0; i--) {
            stageArr.push(stages[i].name.split('-')[0]);
        }

        for (var v = shopInfo.length - 1; v >= 0; v--) {
            var val = shopInfo[v];

            shops.push(val.shop.name);
            var obj = {
                type: 'line',
                data: []
            };
            obj.name = val.shop.name;
            for (var k = val.stageCounts.length - 1; k >= 0; k--) {
                obj.data.push(val.stageCounts[k].total.toFixed(2));
            }
            series.push(obj);
        }

        var wyOption = {
            title: {
                text: '物业阶段评价统计',
                top: 'bottom',
                left: 'center'
            },
            tooltip : {
                trigger: 'axis',
                axisPointer: {
                    type: 'cross',
                    label: {
                        backgroundColor: '#6a7985'
                    }
                }
            },
            legend: {
                data: shops
            },
            xAxis: {
                nameTextStyle: {
                    fontSize: '2'
                },
                data: stageArr
            },
            yAxis: {},
            series: series
        };

        wyChart.setOption(wyOption);
    });

    $.post('/table/shops', {type: 0}, function (data) {
        var stages = data.data.stages;
        var shopInfo = data.data.shopInfos;
        var stageArr = [], shops = [], series = [];

        for (var i = stages.length - 1; i >= 0; i--) {
            stageArr.push(stages[i].name.split('-')[0]);
        }

        for (var v = shopInfo.length - 1; v >= 0; v--) {
            var val = shopInfo[v];

            shops.push(val.shop.name);
            var obj = {
                type: 'line',
                data: []
            };
            obj.name = val.shop.name;
            for (var k = val.stageCounts.length - 1; k >= 0; k--) {
                obj.data.push(val.stageCounts[k].total.toFixed(2));
            }
            series.push(obj);
        }

        var stOption = {
            title: {
                text: '食堂阶段评价统计',
                top: 'bottom',
                left: 'center'
            },
            tooltip : {
                trigger: 'axis',
                axisPointer: {
                    type: 'cross',
                    label: {
                        backgroundColor: '#6a7985'
                    }
                }
            },
            legend: {
                data: shops
            },
            xAxis: {
                nameTextStyle: {
                    fontSize: '2'
                },
                data: stageArr
            },
            yAxis: {},
            series: series
        };

        stChart.setOption(stOption);
    });
}

// 后台stage界面
var options = {};  // 公司对应的图表配置
var shops   = [];  // 公司列表
function showStageStarTable(id) {
    options = {};
    shops   = [];
    var defaultOption = {
        title: {
            text: '2018年5月中旬-全部打分',
            subtext: '第一食堂',
            subtextStyle: {
                color: '#666',
                fontSize: 13
            },
            x: 'center'
        },
        tooltip: {
            trigger: 'item',
            formatter: "{a} <br/>{b} : {c} ({d}%)"
        },
        legend: {
            orient: 'vertical',
            left: 'left',
            data: ['差评', '及格', '良好', '优秀']
        },
        series: {
            name: '评价统计',
            type: 'pie',
            radius: '55%',
            center: ['50%', '60%'],
            label: {
                normal: {
                    formatter: '{a|{a}}{abg|}\n{hr|}\n  {b|{b}: }{c}人  {per|{d}%}  ',
                    backgroundColor: '#eee',
                    borderColor: '#aaa',
                    borderWidth: 1,
                    borderRadius: 4,
                    margin: [0, 15],
                    rich: {
                        a: {
                            color: '#999',
                            lineHeight: 20,
                            align: 'center'
                        },
                        hr: {
                            borderColor: '#aaa',
                            width: '100%',
                            borderWidth: 0.5,
                            height: 0
                        },
                        b: {
                            fontSize: 14,
                            lineHeight: 33
                        },
                        per: {
                            color: '#eee',
                            backgroundColor: '#334455',
                            padding: [4, 4],
                            borderRadius: 2
                        }
                    }
                }
            },
            data: [
                {value: 335, name: '差评'},
                {value: 310, name: '及格'},
                {value: 234, name: '良好'},
                {value: 135, name: '优秀'}
            ]
        }
    };
    $.post('/table/stage/' + id, function (ds) {
        $('.pop-dialog').fadeIn(200);
        var shopStarTable = ds.data;

        if (shopStarTable !== null) {
            defaultOption.title.text = shopStarTable.stage.name;

            for (var i = 0; i < shopStarTable.shopStars.length; i++) {
                var si = shopStarTable.shopStars[i];
                var option = {};
                $.extend(true, option, defaultOption);
                var shopName = si.shop.name;

                option.title.subtext = shopName;
                for (var s = 0; s < si.stars.length; s++) {
                    option.series.data[s].value = si.stars[s];
                }

                shops.push(shopName);
                options[shopName] = option;
            }
        }

        flushStageTable(); // 默认显示shops中的第一个
        var btns = $(".pop-btns");
        btns.html('');

        for (var p in shops) {
            var cls = 'btn-info';
            if (p == 0) {
                cls = 'btn-warning';
            }
            btns.append('<button class="btn btn-sm '+cls+
                '" onclick="flushStageTable(this);">'+shops[p]+'</button>');
        }
    });
}

function flushStageTable(self) {
    var shopName;
    if (self === undefined) {
        shopName = shops[0];
    } else {
        $(self).removeClass('btn-info').addClass('btn-warning');
        $(self).siblings('.btn').each(function (k, v) {
            if ($(v).hasClass('btn-warning')) {
                $(v).removeClass('btn-warning').addClass('btn-info');
            }
        });
        shopName = $(self).text();
    }
    var sum = 0;
    for (var i = 0; i < 4; i++) {
        sum += options[shopName].series.data[i].value;
    }
    $('.pop-dialog .numbers > b').html(sum);

    var stageTable = echarts.init(document.getElementById('stage'));
    stageTable.clear();
    stageTable.setOption(options[shopName]);
}